<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>中文输入法导致的高频事件</title>
</head>

<body>
	<input id="input" type="text">
	<script>
		const el = document.getElementById('input')
		let compositionstatus = false;
		function search() {
			console.log(el.value)
		}
		el.addEventListener('compositionstart', (e) => {
			compositionstatus = true
			console.log('组合开始：')
		})
		el.addEventListener('input', (e) => {
			if (compositionstatus) return
			search()
		})

		el.addEventListener('compositionend', (e) => {
			compositionstatus = false
			console.log('组合结束：')
			search()
		})
	</script>
</body>

</html>